import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import store from './store'
import { Provider } from 'react-redux'

ReactDOM.render(
  <Provider store={store}>
    <App />
  </Provider>,
  document.getElementById('root')
);

/**
 * react:
 *  组件
 *    类组件（有生命周期， this）
 *      生命周期：（组件从创建到销毁的一个过程）
 *        ====初始化过程=====
 *        construtor：初始化的第一个生命周期，通过super函数传入props来修正this指向
 *        ComponentWillMount（）dom挂载前，有this，有state以及props的默认数据
 *        render（）渲染，通过diff算法创建虚拟dom树
 *        ComponentDidMount() dom 挂载后，一边用于请求axios
 *
 *        ===更新过程=====
 *        componentWillReceiveProps (nextProps)  接收到一个新的props  this.props是就值
 *        shouldComponentUpdate(nextProps,nextState)  接收两个参数，新的prosp和新的state，this.props,this.state均为旧值，
 *                                                    返回一个boolean值，返回true，继续更新，返回false，停止更新
 *        ComponentWillUpdate(nextProps,nextState) 接收两个参数，新的prosp和新的state，this.props,this.state均为新值， 数据以及发生了变化但是视图仍未发生变化
 *        render() 通过diff 算法创建新的dom树，并且， 比较新树与旧树的差异，找到最小的差异，进行局部更新
 *        CompoenetDidUpdate(prveProps, PrveState), 接收两个参数，旧的props，旧的state 视图和数据已经发生了变化
 *
 *        ===销毁阶段====
 *        ComponentWillUnMount() 移除事件监听器addEventListener，定时器，延时器等
 *
 *        ===新增生命周期====
 *        get Derived State From Props(nextProps, prevState) => componentWillReceiveProps (nextProps)，react认为旧的生命周期破坏了react的单一数据源
 *        get Snapshot Before Update(prevProps, prevState) =>  ComponentWillUpdate(nextProps,nextState),
 *                                                             react在ComponentWillUpdate中this.props以及this.satte已经为新值，参数无意义
 *    函数组件（没有生命周期，没有this）
 *    组件的通讯方式：
 *      父子通讯： 在父组件中，通过给组件中添加属性传递参数，子组件通过props接收父组件传来的参数
 *      子父通讯：在父组件中定义一个修改state的方法，通过子组件属性，将定义好的方法传递给子组件，子组件通过props接收父组件传来的方法，并且调用，方法可以传参
 *      跨级通化讯：通过React.CreateContext() 创建Provider和Consumer，在最外层父组件中使用Provider包裹住html，Provider组件提供一个属性value
 *                  value接受一个对象，通过value将对象里面的参数挂载到CreateContext上下文中，在后代组件中使用创建好的Consumer包裹祖html，
 *                  Consumer只能接收一个函数，函数拥有默认值，默认值为挂载到CreateContext的value对象
 *      全局通讯： redux（单项数据流）
 *        createStore: 创建仓库的方法，有四个参数reducer，initState，applyMiddleware，combineReducers
 *        reducer: 纯函数，同步，修改state的唯一方式，页面中通过dispatch触发reducer
 *        initState： store仓库的默认值
 *        applyMiddleware: 整合中间的方法
 *        combineReducers： 合并被拆分的reducer
 *  路由
 *  redux
 *
 */